<!DOCTYPE html>
<html lang="en">

    <head>
          <meta charset="UTF-8">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
              <title>母亲节祝福</title>
                <style>
                        /* 全局样式 */
                            body {
                                  font-family: Arial, sans-serif;
                                        margin: 0;
                                              padding: 0;
                                                    background-color: black;
                                                          overflow: hidden;
                                                              }

                                                                  /* 倒计时和文字容器样式 */
                                                                     .countdown-container,
                                                                        .message-container {
                                                                              position: absolute;
                                                                                    top: 50%;
                                                                                          left: 50%;
                                                                                                transform: translate(-50%, -50%);
                                                                                                      color: white;
                                                                                                            text-align: center;
                                                                                                                  font-size: 3em;
                                                                                                                      }

                                                                                                                          /* 背景动画样式 */
                                                                                                                              body::before {
                                                                                                                                    content: "";
                                                                                                                                          position: absolute;
                                                                                                                                                top: 0;
                                                                                                                                                      left: 0;
                                                                                                                                                            width: 100%;
                                                                                                                                                                  height: 100%;
                                                                                                                                                                        background: repeating-linear-gradient(45deg, transparent, transparent 5px, red 5px, red 10px),
                                                                                                                                                                                repeating-linear-gradient(-45deg, transparent, transparent 5px, red 5px, red 10px);
                                                                                                                                                                                      background-size: 20px 20px;
                                                                                                                                                                                            animation: background-scroll 10s linear infinite;
                                                                                                                                                                                                }

                                                                                                                                                                                                    @keyframes background-scroll {
                                                                                                                                                                                                          from {
                                                                                                                                                                                                                  background-position: 0 0;
                                                                                                                                                                                                                        }
                                                                                                                                                                                                                              to {
                                                                                                                                                                                                                                      background-position: 0 100%;
                                                                                                                                                                                                                                            }
                                                                                                                                                                                                                                                }
                                                                                                                                                                                                                                                  </style>
                                                                                                                                                                                                                                                  </head>

                                                                                                                                                                                                                                                  <body>
                                                                                                                                                                                                                                                        <!-- 倒计时容器 -->
                                                                                                                                                                                                                                                          <div class="countdown-container">
                                                                                                                                                                                                                                                                  <span id="countdown"></span>
                                                                                                                                                                                                                                                                    </div>
                                                                                                                                                                                                                                                                      <!-- 文字消息容器 -->
                                                                                                                                                                                                                                                                        <div class="message-container">
                                                                                                                                                                                                                                                                                <span id="message"></span>
                                                                                                                                                                                                                                                                                  </div>

                                                                                                                                                                                                                                                                                    <script>
                                                                                                                                                                                                                                                                                            // 获取元素
                                                                                                                                                                                                                                                                                                const countdownElement = document.getElementById('countdown');
                                                                                                                                                                                                                                                                                                    const messageElement = document.getElementById('message');
                                                                                                                                                                                                                                                                                                        let countdown = 3;

                                                                                                                                                                                                                                                                                                            // 倒计时函数
                                                                                                                                                                                                                                                                                                                function startCountdown() {
                                                                                                                                                                                                                                                                                                                      const countdownInterval = setInterval(() => {
                                                                                                                                                                                                                                                                                                                              countdownElement.textContent = countdown;
                                                                                                                                                                                                                                                                                                                                      if (countdown === 0) {
                                                                                                                                                                                                                                                                                                                                                clearInterval(countdownInterval);
                                                                                                                                                                                                                                                                                                                                                          showMessage('亲爱的妈妈');
                                                                                                                                                                                                                                                                                                                                                                  }
                                                                                                                                                                                                                                                                                                                                                                          countdown--;
                                                                                                                                                                                                                                                                                                                                                                                }, 1000);
                                                                                                                                                                                                                                                                                                                                                                                    }

                                                                                                                                                                                                                                                                                                                                                                                        // 显示消息函数
                                                                                                                                                                                                                                                                                                                                                                                            function showMessage(text) {
                                                                                                                                                                                                                                                                                                                                                                                                  messageElement.textContent = text;
                                                                                                                                                                                                                                                                                                                                                                                                        setTimeout(() => {
                                                                                                                                                                                                                                                                                                                                                                                                                messageElement.textContent = '';
                                                                                                                                                                                                                                                                                                                                                                                                                        if (text === '亲爱的妈妈') {
                                                                                                                                                                                                                                                                                                                                                                                                                                  setTimeout(() => {
                                                                                                                                                                                                                                                                                                                                                                                                                                              messageElement.textContent = '祝您';
                                                                                                                                                                                                                                                                                                                                                                                                                                                          setTimeout(() => {
                                                                                                                                                                                                                                                                                                                                                                                                                                                                        messageElement.textContent = '';
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      setTimeout(() => {
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      messageElement.textContent = '母亲节快乐';
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    }, 1000);
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                }, 1000);
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          }, 1000);
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  }
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        }, 1000);
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            }

                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                // 页面加载完成后启动倒计时
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    window.onload = () => {
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          startCountdown();
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              };
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                </script>
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                </body>

                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                </html>